/*
 * @Author: yangzonglong
 * @Date: 2021-03-01 13:18:46
 * @version: v1.0.0
 * @Descripttion:
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2021-07-25 10:57:01
 * @Auditor:
 */
import React from 'react';
import { FormItemProps } from 'antd/lib/form';
import useQueryControlWrap from '../../hooks/useQueryControlWrap';
import { CanvasItemProps } from '../../interface';
export interface AdjustItemProps extends CanvasItemProps {
  formItemProps?: FormItemProps;
}

const border = { border: '1px dashed #ccc' };
const height = { height: 'auto' };

const App = (props: AdjustItemProps) => {
  const { formItemProps, domComplete, isDesign, ...canvasProps } = props;
  useQueryControlWrap(canvasProps.id, '', domComplete);

  return (
    <div 
      className="adjustSpacing" 
      {...canvasProps} 
      {...formItemProps} 
      style={{ 
        ...formItemProps?.style, 
        ...height,
        padding: isDesign ? '8px' : 0
        }}>
      <div
        style={{
          ...isDesign ? border : { },
          height: formItemProps?.style?.height,
        }}
      ></div>
    </div>
  );
};

export default App;
